<template>
    <div>
        <Article>
            <h2>{{todo?.title}}</h2>
            <p>{{todo?.description}}</p>
            <p>{{todo?.completed}}</p>
        </Article>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { TodosApi } from '../../api';
import { useRoute } from 'vue-router';
const $route = useRoute()
let todo=ref<Todo>()
async function fetchData(id:number) {
    todo.value = (await TodosApi.getTodo(id)).data
}
fetchData(Number($route.params.id))
</script>

<style scoped>

</style>